<template>
	<view> 
		<!-- 侧边抽屉home -->
		<view class="cu-modal drawer-modal justify-end" :class="modalName=='DrawerModalR'?'show':''" @tap="hideModal">
			<view class="cu-dialog basis-lg" @tap.stop="" :style="[{top:CustomBar+'px',height:'calc(100vh - ' + CustomBar + 'px)'}]">
				<view class="cu-list menu text-left">
					<view class="setting_title">设置</view>
					<view class="set_bluetooth">
						<view class="bluetooth_redio">
							<checkbox :checked="setting.bluetooth == 0" @tap="clickcheckd" data-target="bluetooth" data-index="0"></checkbox>
							<view>保存后询问</view>
							<checkbox :checked="setting.bluetooth == 1" @tap="clickcheckd" data-target="bluetooth" data-index="1"></checkbox>
							<view>直接打印</view>
						</view>
						<view class="bluetooth_btn" @tap="BluetoothPrint">蓝牙打印</view>
					</view>
					<view class="set_bluetooth">
						<view class="bluetooth_redio">
							<checkbox :checked="setting.long == 0" @tap="clickcheckd" data-target="long" data-index="0"></checkbox>
							<view>保存后询问</view>
							<checkbox :checked="setting.long == 1" @tap="clickcheckd" data-target="long" data-index="1"></checkbox>
							<view>直接打印</view>
						</view>
						<view class="bluetooth_btn" @tap="Remote">远程打印</view>
					</view>
					<view class="set_bluetooth" v-show="Bill">
						<view class="bluetooth_redio">
							<checkbox :checked="setting.bill == 0" @tap="clickcheckd" data-target="bill" data-index="0"></checkbox>
							<view>保存后询问</view>
							<checkbox :checked="setting.bill == 1" @tap="clickcheckd" data-target="bill" data-index="1"></checkbox>
							<view>直接审核</view>
						</view>
						<view class="bluetooth_btn" @tap="DocumentsReview">单据审核</view>
					</view>
					<view class="func_list">
						<checkbox :checked="setting.repetition == 0" @tap="clickcheckd" data-target="repetition" data-index="0"></checkbox>
						<view class="func_text">重复扫描时只累计数量</view>
					</view>
					<view class="func_list">
						<checkbox :checked="setting.barcode == 0" @tap="clickcheckd" data-target="barcode" data-index="0"></checkbox>
						<view class="func_text">条码规则</view>
					</view>
					<view class="func_list" style="border: none;">
						<view class="func_text" style="text-indent:0">条码查询模式(模糊)</view>
					</view>
					<view class="func_list" style="justify-content: space-between;align-items: center;">
						<checkbox :checked="setting.selectd == 0" @tap="clickcheckd" data-target="selectd" data-index="0"></checkbox>
						<view>全</view>
						<checkbox :checked="setting.selectd == 1" @tap="clickcheckd" data-target="selectd" data-index="1"></checkbox>
						<view>左</view>
						<checkbox :checked="setting.selectd == 2" @tap="clickcheckd" data-target="selectd" data-index="2"></checkbox>
						<view>右</view>
					</view>
					<view class="func_list">
						<checkbox :checked="setting.Openquickscan == 0" @tap="clickcheckd" data-target="Openquickscan" data-index="0"></checkbox>
						<view class="func_text">开启快速扫描</view>
					</view>
				</view>
			</view>
		</view>
		<!-- 侧边抽屉end -->
		<!-- 选择打印机弹框home -->
		<view class="cu-modal printset" :class="modalPrintName=='printSetting'?'show':''">
			<view class="cu-dialog">
				<view class="cu-bar bg-white justify-end">
					<view class="content">打印设置</view>
				</view>
				<view class="padding-xl">
					<view class="printNum">
						<text>打印份数:</text>
						<input class="inpt1" placeholder="打印份数" v-model="printNum"></input>
					</view>
					<view class="uni-list">
						<view class="uni-list-title">打印机编号</view>
						<radio-group @change="radioChange" class="radioWrap">
							<label class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in 25" :key="item">
								<view>
									<radio :value="item+''" :checked="index === current"></radio>
								</view>
								<view>{{item}}</view>
							</label>
						</radio-group>
					</view>
				</view>
				<view class="padding-bt">
					<view @tap="PrintOrder()">确定</view>
					<view @tap="cancelModel()">取消</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: "Drawer",
		props: {
			Billtype: {
				type: String,
				default: ''
			},
			Bill: {
				type: Boolean,
				default: false
			}
		},
		data() {
			return {
				setting: {
					bluetooth: -1,
					long: -1,
					bill: -1,
					repetition: -1,
					// enter:-1,
					barcode: -1,
					selectd: -1,
					Openquickscan: -1
					// IsAll:-1,
				},
				CustomBar: this.CustomBar,
				IsShow: false,
				modalName: null,
				printNum: 0, //打印份数
				current: -1,
				modalPrintName: '', //选择打印机弹出框
				checkd: -1, //选中的打印机
				IsBill: false, //是否建立单据
				IsQuote: -1, //是引用还是查单
			};
		},
		created() {
			var that = this
			//初始化配置 如果为空 则添加默认配置 如果有则赋值本地存储配置
			var settinginfo = uni.getStorageSync(that.Billtype, "")
			if (settinginfo == "" || typeof settinginfo == "undefined") {

				uni.setStorageSync(that.Billtype, JSON.stringify(that.setting))
			} else {
				var d = JSON.parse(settinginfo)
				that.setting = d
			}
		},
		methods: {
			//设置 选中
			clickcheckd(e) {
				console.log(e)
				var name = e.currentTarget.dataset.target
				var index = e.currentTarget.dataset.index
				this.setting[name] = this.setting[name] == index ? -1 : index
				uni.setStorageSync(this.Billtype, JSON.stringify(this.setting))
			},
			//点击了远程打印
			Remote() {
				// console.log(this.IsBill)
				if (this.IsBill != true) {
					uni.showToast({
						position: 'bottom',
						title: "请先建立单据!",
						icon: 'none',
						style: "z-index:9999"
					});
					return;
				} else if (this.IsQuote == 1) {
					uni.showToast({
						position: 'bottom',
						title: "请保存单据后再打印!",
						icon: 'none',
						style: "z-index:9999"
					});
					return;
				}
				this.modalPrintName = 'printSetting';
				// this.$emit("RemotePrint");
			},
			cancelModel() {
				this.modalPrintName = null;
			},
			indexs: function(index) {
				console.log(index);
			},
			//蓝牙打印
			BluetoothPrint() {
				this.$emit("BluetoothPrint");
			},
			//单据审核
			DocumentsReview() {
				this.$emit("DocumentsReview");
			},
			//关闭抽屉
			hideModal() {
				this.IsShow = false;
				this.modalName = null;
			},
			//打开抽屉
			open(e, e1) {
				console.log(e);
				this.IsBill = e;
				this.IsQuote = e1;
				// console.log('点击了打开')
				this.IsShow = true;
				this.modalName = 'DrawerModalR';
			},
			//选中打印机
			radioChange(e) {
				console.log(e);
				this.checkd = e.detail.value;
				console.log(this.checkd);
				console.log(this.printNum);
			},
			PrintOrder() {
				if (this.printNum == 0) {
					uni.showToast({
						position: 'bottom',
						title: "请输入打印份数",
						icon: 'none',
						style: "z-index:9999"
					});
					return
				} else if (this.checkd == -1) {
					uni.showToast({
						position: 'bottom',
						title: "请选择打印机",
						icon: 'none',
						style: "z-index:9999"
					});
					return
				}
				var that = this
				this.$emit("RemotePrint", {
					detail: {
						checkd: that.checkd,
						printNum: that.printNum
					}
				})
				// console.log('点击了确认打印')
			}
		}
	}
</script>

<style>
	/* 侧边样式home */
	.basis-lg {
		padding: 0 10px;
	}

	.setting_title {
		height: 100upx;
		/* background-color: #007AFF; */
		border-bottom: 2px solid #F0AD4E;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 16px;
		/* padding: 0 10px; */

	}

	.set_bluetooth {
		/* padding: 0 10px; */
		border-bottom: 1px solid #f7b886;
	}

	.bluetooth_redio {
		display: flex;
		justify-content: space-between;
		flex-direction: row;
		line-height: 50upx;
		margin-top: 20upx;
	}

	.set_redio {
		width: 50upx;
		height: 50upx;
		/* background-color: #007AFF; */
		display: inline-block;
		/* border: 1px solid #b6b7b7; */
		border-radius: 3px;
	}

	.set_redio>img {
		width: 100%;
		height: 100%;
	}

	.bluetooth_btn {
		width: 100%;
		height: 40px;
		background-color: #007aff;
		margin: 10px auto;
		border-radius: 5px;
		display: flex;
		justify-content: center;
		align-items: center;
		color: #fff;
		box-shadow: 0 1px 4px 0 rgba(12, 12, 13, 0.1);
	}

	.func_list {
		display: flex;
		flex-direction: row;
		line-height: 50upx;
		/* text-indent:25px */
		padding: 7px 0;
		border-bottom: 1px solid #f7b886;
	}

	.func_text {
		text-indent: 12px
	}

	/* 侧边样式home */
	/* 打印机设置 */
	.printset .cu-dialog {
		min-height: 400px;
		max-height: 400px;
		overflow: auto;

	}

	.printset .cu-dialog .cu-bar {
		max-height: 40px;
		min-height: 40px;
	}

	.printset .cu-dialog .padding-bt {
		height: 40px;
		line-height: 40px;
		display: flex;
	}

	.printset .cu-dialog .padding-xl {
		max-height: 320px;
		min-height: 320px;
		overflow: auto;
		padding: 0px;
	}

	.printset .cu-dialog .padding-xl .printNum {
		min-height: 40px;
		max-height: 40px;
		text-align: left;
		padding-left: 8px;
		padding-right: 8px;
		box-sizing: border-box;
		border-bottom: 1px dashed #CCC;
		display: flex;
		padding-top: 5px;
	}

	.printset .cu-dialog .padding-xl .printNum text {
		display: block;
		height: 30px;
		line-height: 30px;
		font-size: 14px;
	}

	.printset .cu-dialog .padding-xl .printNum input {
		border: 1px solid #CCC;
		height: 30px;
		line-height: 30px;
		padding-left: 8px;
		flex: 1;
		margin-left: 8px;
	}

	.printset .cu-dialog .padding-bt view {
		flex: 1;
		border-top: 1px solid #CCC;
	}

	.printset .cu-dialog .uni-list {
		min-height: 280px;
		max-height: 280px;
	}

	.printset .cu-dialog .uni-list .uni-list-title {
		height: 40px;
		line-height: 40px;
		text-align: left;
		padding-left: 10px;
		box-sizing: border-box;
		border-bottom: 1px solid #CCC;
	}

	.printset .cu-dialog .uni-list .radioWrap {
		min-height: 240px;
		max-height: 240px;
		overflow: auto;
		width: 100%;
		padding-left: 8px;
		padding-right: 8px;
		box-sizing: border-box;
	}

	.printset .cu-dialog .uni-list .radioWrap label {
		display: flex;
		line-height: 35px;
		border-bottom: 1px dashed #CCC;
	}

	.printset .cu-dialog .uni-list .radioWrap label radio {
		margin-right: 10px;

	}
	uni-checkbox .uni-checkbox-input.uni-checkbox-input-checked:before{
		font-size:30px
	}


	/* 	.cu-modal .cu-item .content {
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 12px;
	}

	.cu-modal .cu-item .content .content_item {
		flex: 1;
	}

	.cu-modal .cu-item .content text {
		padding-left: 3px;
	}

	.cu-modal .cu-item .content button {
		width: 95%;
		height: 30px;
		line-height: 30px;
		background: rgba(124, 170, 216, 1);
		color: #FFF;
		font-size: 12px;
	} */
</style>
